import { defineStore } from "pinia";

/**
 * @description Tab 标签页的类型定义
 * @property {string} label - 显示的标签名称
 * @property {string} key - 标签唯一标识
 */
export type TabType = {
    label: string;
    key: string;
};

/**
 * @description 动态中的图片信息类型定义
 * @property {string} id - 图片唯一标识
 * @property {number} width - 图片宽度
 * @property {number} height - 图片高度
 * @property {string} url - 图片地址
 */
export type DynamicImageType = {
    id: string;
    width: number;
    height: number;
    url: string;
};

/**
 * @description 动态数据类型定义
 * @property {string} id - 动态唯一标识
 * @property {string} title - 动态标题
 * @property {boolean} isConcern - 是否已关注该动态作者
 * @property {string} content - 动态内容
 * @property {number} concern - 关注数
 * @property {DynamicImageType[]} images - 图片列表
 * @property {number} like_count - 点赞数
 * @property {boolean} is_like - 当前用户是否已点赞
 * @property {number} comment_count - 评论数
 * @property {number} share_count - 分享数
 * @property {string} time - 发布时间
 * @property {Object} user - 用户信息对象
 * @property {string} user.id - 用户ID
 * @property {string} user.ip - 用户IP地址
 * @property {string} user.name - 用户昵称
 * @property {string} user.avatar - 用户头像URL
 */
export type DynamicType = {
    id: string;
    title: string;
    addr: string;
    isConcern: boolean;
    content: string;
    concern: number;
    images: DynamicImageType[];
    dislike_count: number;
    like_count: number;
    is_like: boolean;
    comment_count: number;
    share_count: number;
    time: string;
    nick_name: string;
    fan_count: number;
    user: {
        id: string;
        ip: string;
        name: string;
        avatar: string;
        fans: string;
    };
};

/**
 * @description 动态模块的状态类型定义
 * @property {string} current - 当前选中的 tab key
 * @property {TabType[]} tabs - 所有 tab 列表
 * @property {DynamicType[]} dynamic - 动态列表
 * @property {string[]} concern - 已关注用户的ID列表
 */
type DynamicStoreType = {
    current: string;
    tabs: TabType[];
    dynamic: DynamicType[];
    concern: string[];
};

/**
 * @description 动态状态管理模块
 * 使用 Pinia 定义的状态管理模块，用于管理动态相关的状态
 */
export const useDynamicStore = defineStore("dynamic-store", {
    state: (): DynamicStoreType => ({
        current: "recommend",
        tabs: [
            {
                label: "推荐",
                key: "recommend"
            },
            {
                label: "关注",
                key: "follow"
            },
            {
                label: "附近",
                key: "nearby"
            },
            {
                label: "健康",
                key: "health"
            },
            {
                label: "训练",
                key: "training"
            },
            {
                label: "话题",
                key: "topic"
            },
            {
                label: "领养",
                key: "adoption"
            },
            {
                label: "颜值",
                key: "appearance"
            }
        ],
        dynamic: [],
        concern: []
    }),
    actions: {
        /**
         * @description 设置当前选中的 tab
         * @param {string} payload - 要设置为当前 tab 的 key 值
         */
        setCurrentTab(payload: string) {
            if (this.current === payload) return;
            this.current = payload;
        },

        /**
         * @description 切换至下一个 tab
         * @param {Function} cb - 切换完成后的回调函数，接收当前 tab key 作为参数
         */
        setNextTab(cb: (key: string) => void) {
            const index = this.tabs.findIndex((item) => {
                return item.key === this.current;
            });
            this.current = this.tabs[index + 1]?.key || this.tabs[0].key;
            cb && cb(this.current);
        },

        /**
         * @description 切换至上一个 tab，如果当前 tab 为第一个 tab，则不处理
         * @param {Function} cb - 切换完成后的回调函数，接收当前 tab key 作为参数
         */
        setPreTab(cb: (key: string) => void) {
            const index = this.tabs.findIndex((item) => {
                return item.key === this.current;
            });
            if (index === 0) return;
            this.current = this.tabs[index - 1]?.key || this.tabs[0].key;
            cb && cb(this.current);
        },

        /**
         * @description 设置动态列表数据
         * @param {DynamicType[]} payload - 动态数据数组
         */
        setDynamic(payload: DynamicType[]) {
            (payload || []).forEach((item) => {
                this.dynamic.push(Object.freeze(item));
            });
        },

        /**
         * @description 清空动态列表
         */
        clearDynamic() {
            this.dynamic = [];
        }
    },
    getters: {
        /**
         * @description 根据 ID 获取指定动态数据
         * @returns {DynamicType | undefined} 匹配的动态数据或 undefined
         * @param state
         */
        getDynamic: (state) => {
            return (id: string) => {
                const result = state.dynamic.filter((item) => {
                    return item.id === id;
                });

                return result[0];
            };
        }
    }
});
